<template>
<div class="app">
  <TabControl :titles="['衣服','鞋子','裤子']" @="{tabItemClick:(payload)=>tabItemClick(payload)}"></TabControl>
  <h1>{{pageContents[currentIndex]}}</h1>
</div>
</template>

<script>
import TabControl from "./TabControl.vue";
export default {
  name: "App",
  components:{
    TabControl
  },
  data(){
    return{
      pageContents:['衣服列表','鞋子列表','裤子列表'],
      currentIndex:0
    }
  },
  methods:{
    tabItemClick(val){
      console.log('tabItemClick-val:',val)
      this.currentIndex=val
    }
  }
}
</script>

<style scoped>

</style>